<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>EditField 编辑实地考察</title>
    <!-- 编辑实地考察 -->
    <!-- 基本信息界面 -->
    <!-- 引入样式 -->
    <script type="text/javascript" src="../js/vue.js"></script>
    <script type="text/javascript" src="../js/axios.min.js"></script>
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>

<style>
    .el-textarea{
        width:225px;
    }
    .el-form {
        width: 500px;
        margin-top: -170px;
        margin-left:700px;
    }
    .el-tree{
        width: 700px;
    }
    .el-button{
        margin-left:150px;

    }

</style>
<body>
<div>

</div>
<div id="head"  style="margin-left: 40px">
    <h2>{{massage}}</h2>
    <el-button-group>
        <el-button type="primary" @click="returnClick" icon="el-icon-arrow-left">返回实地考察</el-button>
    </el-button-group>
</div>




    <div id="form" style="float:left;" >

        <el-tree :data="treedata"   :props="defaultProps"  @node-click="handleNodeClick"></el-tree>

            <el-form :inline="true" :model="formInline" class="demo-form-inline">
                <el-form-item label="选择单位">
                    <template>
                        <el-select v-model="formInline.danwei" placeholder="请选择单位名称">
                            <el-option
                                    v-for="item in options"
                                    :key="item.name"
                                    :label="item.name"
                                    :value="item.name">
                            </el-option>
                        </el-select>
                    </template>
                </el-form-item><br>
                <el-input type="hidden" :rows="2" v-model="formInline.id" disabled ></el-input>
                <el-form-item label="扣分项目" prop="textarea">
                <el-input  type="textarea" :rows="4" v-model="formInline.textarea" disabled></el-input><br>
                </el-form-item><br>

                <el-form-item label="分数设置">
                    <el-select v-model="formInline.region" placeholder="请选择得到分数">
                        <el-option label="0.5分" value="0.5"></el-option>
                        <el-option label="1分" value="1"></el-option>
                        <el-option label="1.5分" value="1.5"></el-option>
                        <el-option label="2分" value="2"></el-option>
                        <el-option label="2.5分" value="2.5"></el-option>
                        <el-option label="3分" value="3"></el-option>
                        <el-option label="3.5分" value="3.5"></el-option>
                        <el-option label="4分" value="4"></el-option>
                        <el-option label="4.5分" value="4.5"></el-option>
                        <el-option label="5分" value="5"></el-option>
                    </el-select>
                </el-form-item>
                <el-row>
                <el-button type="primary"  @click="onSubmit" >新增实地考察项目</el-button>
                </el-row>
            </el-form>
     </div>
</div>
</body>

<script>

    var  head=new Vue({
        el:"#head",
        data:{
            massage:"编辑实地考察"
        },
        methods: {
            returnClick:function(){
                window.location.href="/trip/return";
            }
        }

    })
    var  form=new Vue({
        el:"#form",
        data: {
            options:{},
            formInline: {
                region: "",
                danwei: "",
                textarea: "",
            },

            treedata: [{
                id: '1',
                label: '单位文化',
                children: [
                    {id: '4', label: '用电子显示屏、文化墙、固定广告牌等播放社会主义核心价值观、"讲文明树新风"'}
                    , {id: '5', label: '有优质的服务承诺或办事指南并在显示位置公示'}
                    , {id: '6', label: '设立单位善行义举榜，每季度公布一次好人事迹'}]
            }, {
                id: '2',
                label: '整体印象',
                children: [
                    {id: '7', label: '单位创建氛围、干部精神优'},
                    {id: '8', label: '整体办公环境优'},
                    {id: '9', label: '办公人员的整体面貌优'}]


            }, {
                id: '3',
                label: '内外环境',
                children: [
                    {id: '10', label: '物品摆放整齐，单位内不乱堆杂物'},
                    {id: '11', label: '有道德、文化讲堂，有文体活动场所'},
                    {id: '12', label: '全天保洁、无卫生死角'},
                ]

            }],
            defaultProps: {
                children: 'children',
                label: 'label'

            }
        },created:function(){
            //在 then的内部不能使用Vue的实例化的this, 因为在内部 this 没有被绑定。
            var self = this;
            axios.post('/trip/DWname').then(function(response){
                self.options=response.data.options;
                //self.scoreOptions=response.data.scoreOptions;
            })
        }, methods: {
            handleNodeClick:function (data) {
                var lable=data.label;
                this.formInline.textarea=lable;
                this.formInline.id=data.id;
            },
            onSubmit:function () {
                var  self=this;
                    var danwei=this.formInline.danwei;
                    var textarea=this.formInline.textarea;
                    var region=this.formInline.region;
                    var id=this.formInline.id;
                    if (danwei==""||danwei==null){
                        self.$notify({
                            title: '信息不完整',
                            message: '请认真填写实地考察信息',
                            type: 'warning'
                        });
                    }else {
                    //查重方法
                    var chachong={"danwei":danwei,"textarea":textarea}
                    axios.post('/trip/chachong',chachong).then(function(response){
                        if (response.data==1){
                            self.$notify.error({
                                title: '重复提交！',
                                message: '此条考察已提交'
                            });
                        }
                        if(response.data==0){
                            var Xin={"danwei":danwei,"textarea":textarea,"region":region,"id":id};
                            axios.post('/trip/xinzeng',Xin).then(function(response){
                                if (response.data=="aaa"){
                                    self.$notify({
                                        title: '提示',
                                        message: '新增一条实地考察成功，请继续的添加或返回实地考察界面',
                                        duration: 5000
                                    });
                                }
                            })
                        }
                    })


                    }



            }

        }
    })




</script>

</html>